<template>
  <div>
    <h2 class="title">身份选择</h2>
    <div>
      <van-button
      v-for="item in this.$data.list"
      @click="authSelect(item)"
      class="authSelectBtn"
      type="primary" block>{{item.itemName}}</van-button>
    </div>
  </div>
</template>

<script>
  export default {
    data:function() {
      var auth = [
        {itemName:'学校领导', role:1},
        {itemName:'教务管理', role:2},
        {itemName:'班级服务', role:3},
        {itemName:'专题课教师', role:4},
        {itemName:'学员', role:5}
      ]
      /// 登录后根据身份切换
      var stu_auth = [
        {itemName:'学员', role:5}
      ]
      return {list:auth}
    },
    methods:{
      authSelect:function(val) {
        if(val.role == 3) { return; }
        this.$router.push({
          path:'/home',
          query: {
            role:val.role
          }
        })
      }
    }
  }
</script>

<style>
  .title {
    font-size: 24px;
    color: #42B983;
    text-align: center;
  }
  .authSelectBtn {
    font-size: 16px;
    color: #FFFFFF;
    text-align: center;
    margin-top: 8px;
    height: 44px;
    left: 10px;
    width: calc(100% - 20px);
  }
</style>
